import Link from "next/link";
import { withRouter } from "next/router";
import "./index.scss";


const Header = (props) => {
	const { blogStore, router } = props;
	const changeMenu = (type) => {
		blogStore.changeType(type);
	};
	return (
		<div className="main-header">
			<div className="header-content">
				<Link href="/">
					<div className="logo">
						<img src="/static/images/dog_black.png" alt="justdodo" />
						<h1>后知后觉</h1>
					</div>
				</Link>
				<ul className="links">
					<Link href="/">
						<li
							className={router.pathname == "/" || router.pathname.startsWith("/blog") ? "active" : ""}
							onClick={changeMenu.bind(this, "/blogs")}
						>博客</li>
					</Link>
					<Link href="/houses">
						<li
							className={router.pathname.startsWith("/houses")  ? "active" : ""}
							onClick={changeMenu.bind(this, "/houses")}
						>房市</li>
					</Link>
				</ul>
			</div>
		</div>
	);
};

export default withRouter(Header);